/**
 * @project     OTRS (http://www.otrs.org) - Agent Frontend
 * @copyright   OTRS AG
 * @license     AGPL (http://www.gnu.org/licenses/agpl.txt)
 */

/**
 * @package     Skin "Ivory"
 * @section     Skin overrides
 */

@media screen,projection,tv,handheld {

/**
 * @subsection  Color
 * @note        standard colors #69BFCC is the main skin color and #265D66 its dark version
 */

a,
span.Pagination a:hover {
    color: #69BFCC;
}

#Logo {
    opacity: 0.3;
}

.Admin .Size1of2 h4 {
    color: #69BFCC !important;
}

.AdminPerformanceLog .Progressbar {
    background-color: #69BFCC;
}

a:hover,
a:active,
a:focus,
#ToolBar a.Active {
    color: #82CED8;
}

@keyframes border-fill {
    0%   { border-bottom: 2px solid #82CED8; }
    25%  { border-bottom: 2px solid #82CED8; border-left: 2px solid #82CED8; }
    50%  { border-bottom: 2px solid #82CED8; border-left: 2px solid #82CED8; border-top: 2px solid #82CED8; }
    100% { border-bottom: 2px solid #82CED8; border-left: 2px solid #82CED8; border-top: 2px solid #82CED8; border-right: 2px solid #82CED8; }
}

.Admin .Size1of2:hover h4 {
    color: #265D66 !important;
}

input[type=text]:focus,
input[type=password]:focus,
textarea:focus,
input.Focus,
textarea.Focus  {
    border-color: #69BFCC;
}

.Actions li a:hover,
.Actions li span:hover,
.OverviewZoom a:hover {
    border-bottom-color: #69BFCC;
}

/**
 * @subsection  Navigation
 * @note        the default navigation_sprite is transparent and has a transparent reddish
 *              gradient overlay. This works with some colors so you only have to change the
 *              background color of the li items and the anchors on hover. In this case the
 *              red overlay doesn't fit, so changed the main sprite too.
 */

#Navigation > li > a:after {
    background-color: #69BFCC;
}

#Navigation > li:hover > span {
    background-color: #98E1EA;
}

/**
 * @subsection  Overviews
 */

.OverviewMedium li:hover table.Infos td label,
.OverviewLarge > li:hover .Infos table label {
    color: #265D66;
}

/**
 * @subsection  Messages
 */

.MessageBox.Notice {
    border-color: #265D66;
}

.MessageBox.Notice p {
    border-color: #75E4F5;
}

.MessageBox.Notice p,
.MessageBox.Notice a {
    color: #183C41;
}

/**
 * @subsection  Gradients
 */

#Navigation > .Active > ul > li:hover,
#NavigationContainer > a {
    background: #69BFCC;
}

.DataTable tbody tr:hover td,
.TableSmall tbody tr:hover td,
.DataTable tbody tr:hover td,
.TableSmall tbody tr:hover td {
    background: #82CED8;
}

.UseArticleColors .agent-phone:hover > td,
.UseArticleColors .agent-email-external:hover > td,
.UseArticleColors .agent-email-internal:hover > td,
.UseArticleColors .agent-note-external:hover > td,
.UseArticleColors .agent-note-internal:hover > td,
.UseArticleColors .system-note-internal:hover > td,
.UseArticleColors .system-note-external:hover > td,
.UseArticleColors .system-note-report:hover > td,
.UseArticleColors .system-email-external:hover > td,
.UseArticleColors .system-email-internal:hover > td,
.UseArticleColors .customer-webrequest:hover > td,
.UseArticleColors .customer-email-external:hover > td,
.UseArticleColors .customer-note-external:hover > td,
.UseArticleColors .customer-phone:hover > td {
    background: #82CED8 !important;
}

.OverviewMedium li:hover div.Content,
.OverviewMedium li:hover,
.OverviewLarge > li:hover > .Content,
.OverviewLarge > li:hover {
    border-left-color: #69BFCC !important;
}

/*
 * @subsection  Slim styles
 *
 */

#Header {
    height: 42px;
    background-position: bottom;
}

#ToolBar {
    top: 22px;
    left: auto;
    right: 14px;
    z-index: 10;
}

#ToolBar li.UserAvatar {
    margin-top: -6px;
    float: right;
}

#ToolBar li.UserAvatar div {
    right: -25px;
    left: auto;
}

#ToolBar li.UserAvatar div:after {
    left: auto;
    right: 15px;
}

.RTL #ToolBar {
    right: auto;
    left: 14px;
}

#UserInfo {
    top: 2px;
}

#NavigationContainer {
    top: 17px;
}

.DataTable tr td {
    line-height: 14px;
}

.FixedHeader td {
    line-height: 16px;
}

/**
 * @subsection  Input Fields
 */
a.InputField_Action:hover {
    color: #69BFCC;
}

div.InputField_ToolbarContainer ul li a:hover {
    border-bottom-color: #69BFCC;
}

.jstree-InputField .jstree-wholerow-ul .jstree-wholerow:hover,
.jstree-InputField .jstree-wholerow-ul .jstree-wholerow-hovered,
.jstree-InputField .jstree-focused > .jstree-wholerow {
    background-color: #82CED8;
}

.jstree-InputField .jstree-wholerow-ul .jstree-wholerow-clicked:hover,
.jstree-InputField .jstree-wholerow-ul .jstree-wholerow-clicked.jstree-wholerow-hovered,
.jstree-InputField .jstree-focused > .jstree-wholerow-clicked {
    background-color: #69BFCC;
}

ul.Tablelike li:hover {
    background-color: #69BFCC;
}

#ResponsiveNavigationHandle .fa,
#ResponsiveSidebarHandle .fa {
    color: #69BFCC;
}

.ActionRow .Actions li a:hover {
    border-bottom: 2px solid #69BFCC;
}

} /* end @media */
